<%--
  Created by IntelliJ IDEA.
  User: 郑自航
  Date: 2018/7/9
  Time: 14:40
  To change this template use File | Settings | File Templates.
--%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<c:set var="basePath" value="${pageContext.request.contextPath}"></c:set>
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Sys Dict</title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <link rel="stylesheet" href="${basePath}/layui/css/layui.css">
    <script type="text/javascript" src="${basePath}/js/plugin/jquery-2.1.0.min.js"></script>
    <script type="text/javascript" src="${basePath}/js/plugin/jquery.i18n.properties.min.js"></script>
    <script src="${basePath}/layui/layui.js"></script>
</head>

<body class="page-body">
<div class="layui-inline"></div>
<div id="content">
    <form class="layui-form" action="" lay-filter="example">
        <input name="id" type="hidden" value="${id}" id="dict_id">
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label l-lab-text">Value:</label>
                <div class="layui-input-inline">
                    <input name="value" lay-verify="" placeholder="" autocomplete="true" class="layui-input"
                           type="text">
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label l-lab-text">Label:</label>
                <div class="layui-input-inline">
                    <input name="label" lay-verify="" placeholder="标签" autocomplete="true" class="layui-input"
                           type="text">
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label l-lab-text">Type:</label>
                <div class="layui-input-inline" id='dict_type_input'>
                    <input name="type" lay-verify="" style="display: none;" placeholder="" autocomplete="true" class="layui-input" type="text" disabled/>
                    <select name="type" id="dict_type" lay-search="" lay-filter="dict-change">
                        <option value="" class="l-lab-text">All</option>
                    </select>
                </div>
            </div>
            <div class="layui-inline">
                <label class="layui-form-label l-lab-text">New Type</label>
                <div class="layui-input-block">
                    <input type="checkbox" name="newType" lay-skin="switch" lay-filter="dict-type">
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label l-lab-text">Description:</label>
                <div class="layui-input-inline">
                    <input name="description" lay-verify="" placeholder="" autocomplete="true" class="layui-input"
                           type="text">
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label l-lab-text">Sort:</label>
                <div class="layui-input-inline">
                    <input name="sort" lay-verify="" placeholder="" autocomplete="true" class="layui-input"
                           type="number">
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-inline">
                <label class="layui-form-label l-lab-text">Remarks:</label>
                <div class="layui-input-inline">
                    <input name="remarks" lay-verify="" placeholder="" autocomplete="true" class="layui-input"
                           type="text">
                </div>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-input-block">
                <button class="layui-btn l-lab-text" lay-submit lay-filter="formDemo">OK</button>
                <button class="layui-btn layui-btn-warm l-lab-text" onclick="top.layer.close(top.addSysDict_layer)" >Cancel</button>
                <button type="reset" class="layui-btn layui-btn-primary l-lab-text">Rest</button>
            </div>
        </div>
    </form>
</div>
<div class="ibox-content">
    <table class="table-hide" id="demoTable" lay-data="{id: 'idApply'}" lay-filter="Apply"></table>
</div>
<script src="${basePath}/js/i18n.js"></script>
<script src="${basePath}/js/DateFormate.js"></script>
<script>
    $(function () {
        doTranslate();
        $.post('${basePath}/dict/dict/getDictTypes.do',function (result) {
            if(result&&result.code==0){
                for( var opt in result.data){
                    $("#dict_type").append(
                        '<option value="'+result.data[opt]+'" class="l-lab-text">'+result.data[opt]+'</option>'
                    )
                }
            }else {
                top.myLayer.confirm(top._loadText(result.msg));
            }
            doSetEditFormData();
            initForm();
        })

    })
    function doSetEditFormData() {
        var id=$("#dict_id").val();
        if(id){
            $.post('${basePath}/dict/dict/findDictOne.do',{id:id},function (result) {
                if(result&&result.code==0){
                    var data=result.data;
                   // debugger
                    layui.use('form', function(){
                        var form = layui.form;
                        //表单初始赋值
                        form.val('example', {
                            "value": data.value
                            ,"label": data.label
                            ,"description": data.description
                            ,"sort": data.sort
                            ,"type": data.type
                            ,"remarks": data.remarks
                        })
                        form.render();
                    });
                }else {
                    top.myLayer.confirm(top._loadText(result.msg));
                }
            })

        }
    }
    function initForm(){
        layui.use(['form','element'], function(){
            var form = layui.form;

            //监听提交
            form.on('submit(formDemo)', function(data){
                debugger
                // top.layer.msg(JSON.stringify(data.field));
                var disabled=$("#dict_type_input select").attr('disabled');
                if(disabled){
                    data.field.type=$("#dict_type_input input").val();
                }
                var id=data.field.id;
                var url=id?'${basePath}/dict/dict/updateDict.do':'${basePath}/dict/dict/addDict.do'
                $.post(url,data.field,function (result) {
                    if(result&&result.code==0){
                        top.myLayer.msg(top._loadText('Add successful'),null,top.layer.close(top.addSysDict_layer));
                    }else{
                        top.myLayer.confirm(top._loadText('Add failed')+top._loadText(result.msg));
                    }
                })
                return false;
            });
            //新增字典类型开关
            form.on('switch(dict-type)', function(data){
                // console.log(data.elem); //得到checkbox原始DOM对象
                // console.log(data.elem.checked); //是否被选中，true或者false
                // console.log(data.value); //复选框value值，也可以通过data.elem.value得到
                debugger
                var set=data.elem.checked;
                if(set){
                    $("#dict_type_input select").attr('disabled',"true").attr("style","display: none;");
                    $("#dict_type_input input").removeAttr('disabled').attr("style","");
                }else{
                    $("#dict_type_input select").removeAttr('disabled').attr("style","");
                    $("#dict_type_input input").attr('disabled',"true").attr("style","display: none;");
                }
                //重新渲染
                form.render();
            });
            //
            form.on('select(dict-change)', function(data){

                $.post('${basePath}/dict/dict/findDictList.do',{type:data.value},function (result) {
                    if(result&&result.code==0){
                        var data=/*result.data;*/
                        data=result.data[result.data.length-1];
                        // debugger
                        layui.use('form', function(){
                            var form = layui.form;
                            //表单初始赋值
                            form.val('example', {
                                "value": Number(data.value)+1
                                ,"label": data.label
                                ,"description": data.description
                                ,"sort": Number(data.sort)+1
                                // ,"type": data.type
                                ,"remarks": data.remarks
                            })
                            form.render();
                        });
                    }else {
                        top.myLayer.confirm(result.msg);
                    }
                })
            });
        });
    }
</script>
</body>
</html>
